<%--
  Created by IntelliJ IDEA.
  User: 陈海彬
  Date: 2023/9/25
  Time: 19:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>添加出库</title>
    <link rel="stylesheet" href="../../static/css/element-ui.css">
    <script src="../../static/js/vue.js"></script>
    <script src="../../static/js/axios.min.js"></script>
    <script src="../../static/js/element_index.js"></script>
</head>
<body>
<div id="app">
    <%--表格组件--%>
    <el-form :inline="true" :model="searchForm">
        <el-form-item label="分店信息">
            <el-select v-model="searchForm.branchid" placeholder="请选择要查询的分店">
                <el-option v-for="item in branchInfoList" :key="item.branchid" :label="item.branchname"
                           :value="item.branchid"></el-option>
            </el-select>
        </el-form-item>
        <el-form-item>
            <el-button type="success" @click="initOutLibrayInfo(1)" icon="el-icon-search">查询</el-button>
        </el-form-item>
    </el-form>
    <%--按钮组--%>
    <div>
        <el-button @click="batchIssue" type="success" icon="el-icon-more">批量出库</el-button>
        <el-button @click="horizontalTransfer" type="success" icon="el-icon-unfold">平调出库</el-button>
        <el-button @click="refresh" type="success" icon="el-icon-refresh">刷新</el-button>
    </div>
    <div v-if="outLibrayData.length>0">

        <%--表格信息--%>
        <el-table
                @selection-change="outLibraySelectionChange"
                :cell-style="{'text-align':'center'}"
                :header-cell-style="{'text-align':'center'}"
                :data="outLibrayData"
                border
                style="width: 100%">
            <el-table-column
                    type="selection"
                    width="55">
            </el-table-column>

            <el-table-column
                    fixed
                    prop="goods.goodsname"
                    label="商品名称"
                    width="150px">
            </el-table-column>
            <el-table-column
                    label="商品图片"
                    width="200px"
                    height="60px">
                <template slot-scope="scope">
                    <el-image
                            style="width: 200px;height: 60px;"
                            :src="scope.row.goods.url"></el-image>
                </template>
            </el-table-column>
            <el-table-column
                    prop="goods.layout"
                    label="键盘布局"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="keyCap.keycapname"
                    label="键帽材质"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="keyBoardColor.keyboardcolorname"
                    label="键盘颜色"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="goods.shafttype"
                    label="轴体类型"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="shaftChoose.shaftchoose"
                    label="轴体选择"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="goods.interfacetype"
                    label="接口类型"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="backLightColor.backlightcolorname"
                    label="背光颜色"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="branch.branchname"
                    label="店铺名称"
                    width="150px">
            </el-table-column>
            <el-table-column
                    prop="goods.cprice"
                    label="商品进价"
                    width="120px">
            </el-table-column>
            <el-table-column
                    prop="goods.sprice"
                    label="商品售价"
                    width="120px">
            </el-table-column>
            <el-table-column
                    fixed="right"
                    prop="counts"
                    label="商品数量"
                    width="120px">
            </el-table-column>
            <el-table-column label="出库数量" fixed="right" width="200px">
                <template slot-scope="scope">
                    <el-input v-model="scope.row.incounts" placeholder="请输入出库库量"></el-input>
                </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="120">
                <template slot-scope="scope">
                    <el-button type="success" @click="outLibrayRetail(scope.row)">零售</el-button>
                </template>
            </el-table-column>
        </el-table>
        <%--分页组件--%>
        <el-pagination
                @size-change="outLibrayPageSizeChange"
                @current-change="outLibrayPageChange"
                :current-page="outLibrayPage"
                :page-sizes="[5, 10, 20, 30]"
                :page-size="outLibrayPageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="outLibrayTotal">
        </el-pagination>
    </div>
    <el-empty v-else description="暂无数据，请添加库存！"></el-empty>


    <%--平调信息弹出层--%>
    <el-dialog
            title="提示"
            :visible.sync="transferVisible"
            width="80%">
        <el-form :model="transferForm">
            <el-form-item label="分店信息">
                <el-select v-model="transferForm.branchid" placeholder="请选择要平调的分店信息">
                    <el-option label="请选择分店" value=""></el-option>
                    <el-option v-for="item in flatInformationList" :key="item.branchid" :label="item.branchname"
                               :value="item.branchid"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item>
                <el-button type="success" @click="transferFormBtn">立即提交</el-button>
                <el-button @click="transferForm.branchid=''">重置</el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
</div>
<script>
    let app = new Vue({
        el: "#app",
        data: {
            /*入库所需的数据*/
            outLibrayData: [],//入库的商品信息列表
            outLibrayPage: 1,//入库的页数
            outLibrayPageSize: 5,//入库每页展示的最大数
            outLibrayTotal: 0,//入库的总条数
            outLibrayCheck: [],//入库信息选中列表

            transferVisible: false,//平调信息弹出层
            transferForm: {
                //平调分店
                branchid: undefined
            },

            /*下拉框数据*/
            searchForm: {
                /*分店id*/
                branchid: undefined
            },//下拉选择框
            branchInfoList: [],//下列选择框数据

            flatInformationList: [],//平调分店下拉框数据
            userInfo: {},

        },
        created() {
            this.initUserInfo();
            /*初始化入库的商品信息*/
            this.initOutLibrayInfo();
            /*初始化下拉框数据*/
            this.initBranchInfo();
            /*平调分店下拉框数据*/
            this.flatInformation();
        },
        methods: {
            /*获取用户信息*/
            initUserInfo() {
                axios.get('/user/getUserInfo').then(res => {
                    this.userInfo = res.data.data;
                })
            },
            /*初始化入库的商品信息*/
            initOutLibrayInfo(val) {
                if (val === 1) {
                    this.outLibrayPage = 1;
                }
                axios.get('/outLibray/getInformation', {
                    params: {
                        page: this.outLibrayPage,
                        pageSize: this.outLibrayPageSize,
                        branchid: this.searchForm.branchid
                    }
                }).then(res => {
                    this.outLibrayData = res.data.data.rows;
                    this.outLibrayTotal = res.data.data.total;
                })
            },
            /*获取下拉框数据*/
            initBranchInfo() {
                let self = this;
                axios.get('/branch/list').then(res => {
                    self.branchInfoList = res.data.data;
                })
            },
            /*获取平调分店下拉框数据*/
            flatInformation() {
                axios.get('/branch/flatInformation').then(res => {
                    this.flatInformationList = res.data.data;
                    console.log(this.flatInformationList)
                })
            },
            /*入库商品调整最大显示数量*/
            outLibrayPageSizeChange(val) {
                this.outLibrayPageSize = val;
                this.initOutLibrayInfo();
            },
            /*入库商品调整当前页码*/
            outLibrayPageChange(val) {
                this.outLibrayPage = val;
                this.initOutLibrayInfo();
            },
            /*多选框选中事件*/
            outLibraySelectionChange(val) {
                this.outLibrayCheck = val;
            },
            /*商品零售*/
            outLibrayRetail(row) {
                /*进行输入格式校验*/
                if (row.incounts === null) {
                    this.$message({
                        message: '请输入您想要零售的数量！',
                        center: true
                    });
                    return;
                } else if (row.incounts <= 0) {
                    this.$message({
                        message: '零售商品数量有误，请重新输入！',
                        center: true
                    });
                    return;
                } else if (row.incounts >= 6) {
                    this.$message({
                        message: '零售商品数量大于5，请选择批量！',
                        center: true
                    });
                    return;
                } else if (row.incounts <= 5 && row.counts < row.incounts) {
                    this.$message({
                        message: '零售商品数量大于库存！',
                        center: true
                    });
                    return;
                } else if (row.branchid != this.userInfo.branchid) {
                    this.$message({
                        message: '对不起，你没有权限出库该分店商品！',
                        center: true
                    });
                    return;
                }
                /* if (!this.getOutLibrayCount([row])) {
                     return;
                 }*/

                //添加单条入库信息
                axios.post('/outLibray/addOutLibray?outmethod=1', [row]).then(res => {
                    if (res.data.code === 200) {
                        this.$message({
                            message: '操作成功',
                            type: 'success'
                        });
                        this.refresh();
                    } else {
                        this.$message.error('操作失败，请联系管理员解决！');
                    }
                })
            },
            /*批量出库*/
            batchIssue() {
                /*检测数据格式*/
                for (let item of this.outLibrayCheck) {
                    if (item.incounts === null || item.incounts <= 0) {
                        this.$message({
                            message: '请检查你的数据格式！',
                            center: true
                        });
                        return;
                    } else if (item.branchid != this.userInfo.branchid) {
                        this.$message({
                            message: '对不起，你没有权限出库该分店商品！',
                            center: true
                        });
                        return;
                    } else if (item.counts < item.incounts) {
                        this.$message({
                            message: '出库数量不能大于商品总量！',
                            center: true
                        });
                        return;
                    }
                }
                if (this.outLibrayCheck.length > 0) {
                    this.$confirm('进行批量出库申请吗?', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消',
                        type: 'warning'
                    }).then(() => {
                        /*if (!this.getOutLibrayCount(this.outLibrayCheck)) {
                            return;
                        }*/
                        axios.post('/outLibray/addOutLibray?outmethod=2', this.outLibrayCheck).then(res => {
                            if (res.data.code === 200) {
                                this.$message({
                                    message: '操作成功',
                                    type: 'success'
                                });
                                this.initUserInfo();
                            } else {
                                this.$message.error('操作失败，请联系管理员解决！');
                            }
                        })
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消出库申请'
                        });
                    });
                } else {
                    this.$message({
                        message: '请选择要申请出库的数据！',
                        type: 'warning'
                    });
                }
            },
            /*刷新*/
            refresh() {
                this.outLibrayPage = 1;
                this.outLibrayPageSize = 5;
                this.initOutLibrayInfo();
            },
            /*平调出库*/
            horizontalTransfer() {
                if (this.outLibrayCheck.length > 0) {
                    /*进行非空校验*/
                    for (let item of this.outLibrayCheck) {
                        if (item.incounts === null || item.incounts <= 0) {
                            this.$message({
                                message: '请检查你的数据格式！',
                                center: true
                            });
                            return;
                        } else if (item.counts < item.incounts) {
                            this.$message({
                                message: '出库数量不能大于商品总量！',
                                center: true
                            });
                            return;
                        } else if (item.branchid !== this.userInfo.branchid) {
                            this.$message({
                                message: '对不起，你没有权限平调该分店商品！',
                                center: true
                            });
                            return;
                        }
                    }
                    this.$confirm('进行平调出库申请吗？', '提示', {
                        confirmButtonText: '确定',
                        cancelButtonText: '取消'
                    }).then(() => {
                        this.transferVisible = true;
                    }).catch(() => {
                        this.$message({
                            type: 'info',
                            message: '已取消申请'
                        });
                    });
                } else {
                    this.$message({
                        showClose: true,
                        message: '请选择要平调出库的数据！',
                        type: 'warning'
                    });
                }
            },
            /*提交平调审核的按钮*/
            transferFormBtn() {
                /* if (!this.getOutLibrayCount(this.outLibrayCheck)) {
                     this.transferVisible = false;
                     return;
                 }*/

                axios.post('/outLibrayTransfer/addOutLibrayTransfer?branchid=' +
                    this.transferForm.branchid, this.outLibrayCheck).then(res => {
                    if (res.data.code === 200) {
                        this.$message({
                            message: '平调出库成功',
                            type: 'success'
                        });
                    } else {
                        this.$message.error('平调失败，请联系管理员解决！');
                    }
                    this.transferVisible = false;
                    this.transferForm.branchid = undefined;
                    this.outLibrayCheck = []
                })
            },

            /*查看当前商品是否满足平调*/
            getOutLibrayCount(item) {
                axios.post('/outLibray/getOutLibrayCount', item).then(res => {
                    if (res.data.code === 202) {
                        this.$message(res.data.msg);
                        return false;
                    } else {
                        return true;
                    }
                })
            }

        }
    })
</script>
</body>
</html>
